<template>
  <div>
    <el-page-header @back="goBack" content="提现页">
    </el-page-header>
    <div class="withdrawal-card">
      <h1 style="color: red;margin-bottom: 10px">提现</h1>
      <el-form ref="form" :model="form" label-width="80px" action="localhost:/api/payment/dealWallet" method="post">
        <el-form-item label="提现金额">
          <el-select v-model="form.value" placeholder="请选择提现金额">
            <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="提现账户">
          <el-radio-group v-model="form.resource">
            <el-radio-group v-model="form.resource" style="display: flex">
              <el-radio label=1 style="display: flex; align-items: center;"> <svg t="1687845224007" class="icon" viewBox="0 0 1228 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3102" width="18" height="18"><path d="M530.8928 703.1296a41.472 41.472 0 0 1-35.7376-19.8144l-2.7136-5.5808L278.272 394.752a18.7392 18.7392 0 0 1-2.048-8.1408 19.968 19.968 0 0 1 20.48-19.3536c4.608 0 8.8576 1.4336 12.288 3.84l234.3936 139.9296a64.4096 64.4096 0 0 0 54.528 5.9392L1116.2624 204.8C1004.9536 80.896 821.76 0 614.4 0 275.0464 0 0 216.576 0 483.6352c0 145.7152 82.7392 276.8896 212.2752 365.5168a38.1952 38.1952 0 0 1 17.2032 31.488 44.4928 44.4928 0 0 1-2.1504 12.3904l-27.6992 97.4848c-1.3312 4.608-3.328 9.3696-3.328 14.1312 0 10.752 9.216 19.3536 20.48 19.3536 4.4032 0 8.0384-1.536 11.776-3.584l134.5536-73.3184c10.1376-5.5296 20.7872-8.96 32.6144-8.96 6.2976 0 12.288 0.9216 18.0736 2.5088 62.72 17.0496 130.4576 26.5728 200.5504 26.5728C953.7024 967.168 1228.8 750.592 1228.8 483.6352c0-80.9472-25.4464-157.1328-70.0416-224.1024l-604.9792 436.992-4.4544 2.4064a42.1376 42.1376 0 0 1-18.432 4.1984z" fill="#15BA11" p-id="3103"></path></svg>
                <span style="margin-left: 5px;">微信</span> </el-radio>
              <el-radio label=2 style="display: flex; align-items: center;"> <svg t="1687845753885" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3440" width="18" height="18"><path d="M1024.0512 701.0304V196.864A196.9664 196.9664 0 0 0 827.136 0H196.864A196.9664 196.9664 0 0 0 0 196.864v630.272A196.9152 196.9152 0 0 0 196.864 1024h630.272a197.12 197.12 0 0 0 193.8432-162.0992c-52.224-22.6304-278.528-120.32-396.4416-176.64-89.7024 108.6976-183.7056 173.9264-325.3248 173.9264s-236.1856-87.2448-224.8192-194.048c7.4752-70.0416 55.552-184.576 264.2944-164.9664 110.08 10.3424 160.4096 30.8736 250.1632 60.5184 23.1936-42.5984 42.496-89.4464 57.1392-139.264H248.064v-39.424h196.9152V311.1424H204.8V267.776h240.128V165.632s2.1504-15.9744 19.8144-15.9744h98.4576V267.776h256v43.4176h-256V381.952h208.8448a805.9904 805.9904 0 0 1-84.8384 212.6848c60.672 22.016 336.7936 106.3936 336.7936 106.3936zM283.5456 791.6032c-149.6576 0-173.312-94.464-165.376-133.9392 7.8336-39.3216 51.2-90.624 134.4-90.624 95.5904 0 181.248 24.4736 284.0576 74.5472-72.192 94.0032-160.9216 150.016-253.0816 150.016z" fill="#009FE8" p-id="3441"></path></svg>
                <span style="margin-left: 5px;">支付宝</span> </el-radio>
              <el-radio label=3 style="vertical-align: middle"> <svg t="1687847178017" class="icon" viewBox="0 0 1325 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5488" width="22" height="22"><path d="M342.874353 817.543529l87.341176-376.470588h-3.011764c-3.011765 0-7.529412 1.505882-10.541177 3.011765-1.505882 7.529412-6.023529 28.611765-9.035294 37.647059-4.517647 19.576471-4.517647 22.588235-6.023529 33.129411l-1.505883 1.505883h-37.647058l-1.505883-1.505883 9.035294-36.141176c7.529412-33.129412 9.035294-45.176471 12.047059-61.741176l1.505882-1.505883c16.564706-3.011765 21.082353-3.011765 40.658824-6.023529l1.505882 1.505882-3.011764 10.541177c3.011765-1.505882 6.023529-4.517647 9.035294-6.02353 1.505882-1.505882 3.011765-1.505882 6.023529-3.011765l45.176471-191.247058c9.035294-42.164706 51.2-75.294118 91.858823-75.294118h-274.070588c-42.164706 0-82.823529 33.129412-91.858823 75.294118l-138.541177 596.329411c-9.035294 42.164706 16.564706 75.294118 57.223529 75.294118h272.564706c-42.164706 0-67.764706-34.635294-57.223529-75.294118z m-27.105882-313.223529c-13.552941 7.529412-33.129412 12.047059-54.211765 12.047059-16.564706 0-45.176471-3.011765-54.211765-19.576471-4.517647-6.023529-6.023529-12.047059-6.023529-19.57647l3.011764-27.105883 1.505883-7.529411 22.588235-97.882353 1.505882-6.02353s7.529412 1.505882 49.694118 0v1.505883c-4.517647 12.047059-25.6 97.882353-25.6 97.882352l-4.517647 25.6v4.517648c1.505882 12.047059 9.035294 19.576471 22.588235 19.57647 9.035294 0 15.058824-3.011765 22.588236-7.529412 10.541176-9.035294 13.552941-22.588235 18.070588-42.164706 0 0 21.082353-94.870588 21.082353-100.894117 3.011765 0 12.047059 1.505882 42.164706 0v1.505882c-4.517647 12.047059-25.6 102.4-25.6 102.4l-3.011765 9.035294c-3.011765 19.576471-9.035294 40.658824-31.623529 54.211765z" fill="#D43634" p-id="5489"></path><path d="M669.650824 817.543529l22.588235-99.388235H665.133176c-4.517647 0-7.529412 0-10.541176-1.505882-3.011765-1.505882-6.023529-4.517647-6.023529-7.529412s1.505882-7.529412 3.011764-13.552941l46.682353-153.6h33.129412l-4.517647 16.564706 4.517647-4.517647 9.035294-37.647059h-21.082353v-1.505883c1.505882-6.023529 3.011765-13.552941 4.517647-19.57647l1.505883-9.035294c3.011765-13.552941 6.023529-30.117647 6.023529-36.141177 0-3.011765 1.505882-10.541176-7.529412-10.541176-3.011765 0-7.529412 1.505882-12.047059 3.011765-1.505882 7.529412-6.023529 28.611765-9.035294 37.647058-4.517647 19.576471-4.517647 22.588235-6.023529 33.129412l-1.505882 1.505882h-37.647059l-1.505883-1.505882 9.035294-36.141176c7.529412-33.129412 9.035294-45.176471 10.541177-61.741177l1.505882-1.505882c16.564706-3.011765 21.082353-3.011765 40.658824-6.02353l1.505882 1.505883-3.011765 10.541176c3.011765-1.505882 6.023529-4.517647 9.035295-6.023529 9.035294-4.517647 18.070588-6.023529 24.094117-6.02353 4.517647 0 9.035294 0 13.552941 3.011765l43.670589-191.247059c9.035294-42.164706 51.2-75.294118 93.364706-75.294117h-326.776471c-42.164706 0-82.823529 33.129412-91.858824 75.294117l-43.670588 191.247059c7.529412-3.011765 13.552941-3.011765 18.070588-3.011765 7.529412 0 16.564706 3.011765 21.082353 12.047059 3.011765 9.035294 1.505882 19.576471-3.011764 39.152941l-3.011765 10.541177c-4.517647 22.588235-6.023529 27.105882-7.529412 42.164706l-4.517647 4.517647h-37.647059v-1.505883c1.505882-6.023529 3.011765-13.552941 4.517647-19.57647l1.505883-9.035294c3.011765-13.552941 6.023529-30.117647 6.023529-36.141177 0-3.011765 1.505882-9.035294-4.517647-10.541176l-87.341176 376.470588c-9.035294 42.164706 16.564706 75.294118 57.223529 75.294118h328.282353c-40.658824 1.505882-66.258824-33.129412-57.223529-73.788236z m12.047058-263.529411l-7.529411 24.094117h-52.705883l-6.023529 4.517647c-3.011765 3.011765-3.011765 1.505882-6.02353 3.011765s-9.035294 4.517647-18.070588 4.517647h-16.564706l7.529412-22.588235h4.517647c4.517647 0 7.529412 0 9.035294-1.505883 1.505882-1.505882 3.011765-3.011765 6.02353-7.529411l9.035294-18.070589h39.152941l-6.023529 13.552942h37.647058z m-140.047058-124.988236l-7.529412 30.117647c-1.505882 6.023529-3.011765 13.552941-4.517647 19.576471-3.011765 13.552941-4.517647 19.576471-6.02353 22.588235-1.505882 3.011765-1.505882 6.023529-3.011764 13.552941h-43.670589c1.505882-7.529412 3.011765-10.541176 4.517647-13.552941s1.505882-6.023529 4.517647-13.552941c3.011765-10.541176 4.517647-18.070588 6.02353-25.6 1.505882-6.023529 4.517647-24.094118 6.023529-30.117647-1.505882-4.517647 1.505882-9.035294 7.529412-13.552941 9.035294-6.023529 22.588235-7.529412 31.623529-3.011765 6.023529 3.011765 7.529412 9.035294 4.517648 13.552941z m7.529411 34.635294c3.011765-13.552941 9.035294-28.611765 19.576471-39.152941 16.564706-15.058824 36.141176-15.058824 45.17647-15.058823 13.552941 0 28.611765 3.011765 36.141177 13.552941 4.517647 6.023529 9.035294 18.070588 4.517647 40.658823-1.505882 7.529412-6.023529 24.094118-16.564706 34.635295-13.552941 13.552941-30.117647 18.070588-48.188235 18.070588-6.023529 0-16.564706-1.505882-24.094118-4.517647-22.588235-9.035294-19.576471-33.129412-16.564706-48.188236z m81.317647 254.494118h-43.670588c-3.011765 0-6.023529 0-10.541176-1.505882-3.011765-1.505882-6.023529-3.011765-7.529412-4.517647-1.505882-3.011765-4.517647-4.517647-3.011765-10.541177l12.047059-42.164706h-21.082353l7.529412-24.094117h21.082353l6.023529-19.576471h-21.082353l7.529412-22.588235h94.870588l-7.529412 22.588235h-37.647058l-6.02353 19.576471h39.152941l-6.023529 24.094117h-39.152941l-9.035294 31.62353c-1.505882 3.011765 9.035294 4.517647 13.552941 4.517647l19.57647-3.011765-9.035294 25.6z" fill="#034582" p-id="5490"></path><path d="M723.862588 566.061176l-7.529412 25.6s3.011765-1.505882 6.02353-4.517647l4.517647-21.082353h-3.011765z m-129.505882-72.282352c4.517647 0 7.529412-3.011765 10.541176-7.529412 4.517647-6.023529 7.529412-21.082353 9.035294-24.094118 4.517647-18.070588 3.011765-28.611765-6.023529-28.611765-12.047059 0-16.564706 15.058824-21.082353 31.62353-1.505882 6.023529-3.011765 12.047059-3.011765 16.564706 3.011765 12.047059 10.541176 12.047059 10.541177 12.047059z m94.870588 189.741176c-1.505882 4.517647-1.505882 7.529412-1.505882 7.529412 1.505882 1.505882 3.011765 3.011765 4.517647 3.011764h4.517647l13.552941-58.729411h-7.529412l-13.552941 48.188235z m24.094118-81.317647l-3.011765 10.541176h7.529412l3.011765-10.541176h-7.529412z" fill="#034582" p-id="5491"></path><path d="M967.815529 493.778824c4.517647 0 12.047059-3.011765 15.058824-7.529412 1.505882-1.505882 3.011765-6.023529 4.517647-9.035294 1.505882-4.517647 3.011765-10.541176 3.011765-15.058824 1.505882-3.011765 1.505882-6.023529 1.505882-9.035294 1.505882-12.047059-3.011765-19.576471-10.541176-19.576471-12.047059 0-16.564706 15.058824-21.082353 31.62353-1.505882 6.023529-3.011765 12.047059-3.011765 16.564706 3.011765 12.047059 10.541176 12.047059 10.541176 12.047059z m-203.294117 118.964705l3.011764-10.541176h-48.188235l-3.011765 10.541176h40.658824c6.023529 0 7.529412 1.505882 7.529412 0z" fill="#107C84" p-id="5492"></path><path d="M1198.215529 147.425882h-296.658823c-42.164706 0-82.823529 33.129412-93.364706 75.294118l-43.670588 191.247059c3.011765 1.505882 6.023529 4.517647 7.529412 9.035294 3.011765 9.035294 1.505882 19.576471-3.011765 39.152941l-3.011765 10.541177c-4.517647 22.588235-6.023529 27.105882-7.529412 42.164705l-1.505882 1.505883h-16.564706l-9.035294 37.647059c3.011765-3.011765 9.035294-6.023529 12.047059-7.529412 7.529412-3.011765 24.094118-6.023529 24.094117-6.02353h52.705883l-18.070588 60.235295c-3.011765 10.541176-6.023529 16.564706-9.035295 19.57647-1.505882 3.011765-4.517647 6.023529-9.035294 9.035294-4.517647 3.011765-9.035294 4.517647-12.047058 4.517647h-60.235295l-13.552941 58.729412 18.070588-1.505882-7.529411 27.105882h-15.058824l-24.094117 99.388235c-9.035294 42.164706 16.564706 75.294118 57.223529 75.294118h296.658823c42.164706 0 82.823529-33.129412 93.364706-75.294118l138.541177-594.823529c9.035294-42.164706-16.564706-75.294118-57.22353-75.294118z m-212.329411 263.529412c6.023529 3.011765 10.541176 6.023529 13.552941 10.541177v-4.517647l1.505882-1.505883c18.070588-3.011765 22.588235-3.011765 42.164706-6.023529v1.505882c-3.011765 13.552941-7.529412 28.611765-10.541176 42.164706-7.529412 30.117647-9.035294 45.176471-12.047059 60.235294l-1.505883 1.505882h-39.152941l-1.505882-1.505882c0-1.505882 1.505882-4.517647 1.505882-6.023529-6.023529 4.517647-12.047059 9.035294-19.57647 9.035294s-13.552941-1.505882-21.082353-4.517647c-22.588235-9.035294-19.576471-34.635294-16.564706-48.188236 3.011765-13.552941 9.035294-28.611765 19.57647-39.152941 16.564706-13.552941 34.635294-16.564706 43.670589-13.552941z m-204.8 105.411765l28.611764-118.964706 12.047059-54.211765s1.505882-4.517647 1.505883-6.023529c6.023529 0 18.070588 1.505882 51.2 0h12.047058c25.6 0 46.682353 0 58.729412 15.058823 4.517647 6.023529 6.023529 13.552941 6.02353 21.082353 0 6.023529-1.505882 12.047059-1.505883 16.564706-4.517647 19.576471-15.058824 36.141176-28.611765 46.682353-21.082353 16.564706-49.694118 16.564706-73.788235 16.564706h-3.011765l-3.011764 3.011765c0 1.505882-6.023529 24.094118-6.02353 24.094117s-6.023529 31.623529-7.529411 37.647059c-7.529412-1.505882-19.576471-1.505882-46.682353-1.505882z m10.541176 137.035294c-1.505882 4.517647-3.011765 7.529412-6.023529 10.541176-3.011765 3.011765-7.529412 6.023529-18.070589 6.02353h-18.070588v16.564706c0 4.517647 1.505882 4.517647 1.505883 4.517647s1.505882 1.505882 3.011764 1.505882h6.02353l18.070588-1.505882-9.035294 27.105882h-19.576471c-13.552941 0-24.094118 0-28.611764-3.011765-3.011765-1.505882-4.517647-4.517647-3.011765-9.035294l1.505882-64.752941h31.62353v13.552941h7.529411c3.011765 0 4.517647 0 6.02353-1.505882 1.505882-1.505882 1.505882-1.505882 1.505882-3.011765l3.011765-10.541176h25.6l-3.011765 13.552941z m111.435294 64.752941h-34.635294l3.011765-7.529412h-69.270588l7.529411-22.588235h7.529412l36.141177-121.976471 7.529411-24.094117h34.635294l-3.011764 12.047059s9.035294-6.023529 18.070588-9.035294c7.529412-1.505882 43.670588-3.011765 55.717647-3.011765h37.647059v13.552941c0 3.011765 1.505882 3.011765 6.023529 3.011765h6.02353l-6.02353 24.094117h-19.57647c-18.070588 1.505882-24.094118-6.023529-24.094118-15.058823v-13.552941l-3.011765 12.047058h-12.047058l-36.141177 120.470589h9.035294l-7.529412 24.094117h-10.541176l-3.011765 7.529412z m155.105883-106.917647h-37.647059l-6.02353 19.576471h37.647059l-6.023529 19.57647h-40.658824l-7.529412 9.035294h16.564706l4.517647 25.6c0 3.011765 0 4.517647 1.505883 6.02353 1.505882 1.505882 6.023529 1.505882 9.035294 1.505882h4.517647l-7.529412 25.6h-21.082353c-4.517647 0-6.023529-3.011765-9.035294-4.517647-3.011765-1.505882-6.023529-4.517647-6.023529-9.035294l-4.517647-25.6-18.070589 25.6c-6.023529 7.529412-13.552941 13.552941-27.105882 13.552941h-25.6l7.529412-22.588235h10.541176c3.011765 0 6.023529-1.505882 7.529412-1.505883 1.505882-1.505882 3.011765-1.505882 6.023529-4.517647l27.105883-37.647058h-36.141177l6.02353-21.082353h40.658823l6.02353-19.576471h-40.658824l7.529412-22.588235h112.941176l-12.047058 22.588235z m24.094117-70.776471l-1.505882 1.505883-15.058824 25.6c-4.517647 9.035294-13.552941 15.058824-27.105882 15.058823h-22.588235l7.529411-22.588235h4.517648c3.011765 0 4.517647 0 6.023529-1.505882 1.505882 0 1.505882-1.505882 3.011765-3.011765l7.529411-13.552941c12.047059-18.070588 15.058824-25.6 27.105883-45.176471-1.505882-22.588235-3.011765-30.117647-4.517647-43.670588-1.505882-9.035294-3.011765-18.070588-3.011765-27.105882-1.505882-18.070588-1.505882-15.058824-4.517647-27.105883v-1.505882l1.505882-1.505882c18.070588-1.505882 18.070588-3.011765 37.647059-6.02353l1.505882 1.505883 3.011765 49.694117v3.011765c10.541176-22.588235 10.541176-16.564706 22.588235-45.176471v-1.505882l1.505883-1.505882c16.564706-1.505882 19.576471-3.011765 39.152941-6.02353l1.505882 1.505883c-1.505882 0-75.294118 128-85.835294 149.082352z" fill="#107C84" p-id="5493"></path><path d="M775.062588 579.614118l4.517647-13.552942h-51.2l-4.517647 21.082353c7.529412-4.517647 15.058824-7.529412 22.588236-7.529411h28.611764z m105.411765-159.62353c10.541176-4.517647 18.070588-15.058824 19.576471-27.105882 3.011765-13.552941-1.505882-22.588235-10.541177-27.105882l-25.6-1.505883h-4.517647V368.790588l-12.047059 52.705883v3.011764h6.02353c9.035294 0 19.576471 0 27.105882-4.517647z m-28.611765 266.541177h28.611765l7.529412-27.105883h-28.611765l-7.529412 27.105883z m36.141177-120.470589l-9.035294 30.117648s10.541176-4.517647 16.564705-6.02353c6.023529-1.505882 15.058824-1.505882 15.058824-1.505882l6.023529-22.588236h-28.611764z m-24.094118 76.8s10.541176-6.023529 16.564706-7.529411c6.023529-1.505882 15.058824-3.011765 15.058823-3.011765l7.529412-22.588235h-28.611764l-10.541177 33.129411z" fill="#107C84" p-id="5494"></path></svg>
                <span style="margin-left: 5px;">银行卡</span> </el-radio>
            </el-radio-group>
          </el-radio-group>
        </el-form-item>

        <el-form-item>
          <el-button style="float: right" type="primary" @click="onSubmit">提现</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>

</template>


<script>
import { MessageBox } from "element-ui";
import Api from "@/api/wallet";

export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: "index",
  data() {
    return {
      form: {
        status: 0,
        value: "",
        resource: "",
      },
      options: [
        { value: 10, label: "10元" },
        { value: 30, label: "30元" },
        { value: 50, label: "50元" },
        { value: 100, label: "100元" },
        { value: 500, label: "500元" },
        { value: 1000, label: "1000元" },
      ],
    };
  },

  methods: {
    onSubmit() {
      if ("" === this.form.value || "" === this.form.resource) {
        MessageBox.alert(
            "信息不全，无法提现",
            "提示",
            {
              confirmButtonText: "确定",
              type: "error",
            }
        ).catch(() => {});
      } else {
        let message = "";
        if (this.form.resource === "1") {
          message = "提现到微信成功。";
        } else if (this.form.resource === 2) {
          message = "提现到支付宝成功。";
        } else if (this.form.resource === 3) {
          message = "提现到银行卡成功。";
        }
        message += "提现金额为：" + this.form.value + "元。";
        MessageBox.confirm(
            message,
            "提现确认",
            {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning",
            }
        ).then(res=> {
              if(res==="confirm"){
                this.$message({
                  type: "success",
                  message: "您已成功申请提现。",
                });
                Api.submit(this.form).then(res=>{
                  console.log(res)
                }).catch(err=>{
                  console.log("失败")
                  console.log(err)
                })
                // this.$refs.form.submit();
              }
            })
            .catch(err => {
              if(err==="cancel"){
                this.$message({
                  type: "info",
                  message: "已取消操作。"
                });
              }
            });
      }
    },
  },
};
</script>

<style scoped>
.withdrawal-card {
  width: 30%;
  margin-left: 25%;
  margin-top: 8%;
}
</style>
